CSCIĀ 0062. Web Programming I

Units: 3
Prerequisite: Completion of CSCI 10 with grade of "C" or better
Hours: 72 (54 lecture, 18 laboratory)
Introduction to methods and techniques of Web programming. Includes coverage of HyperText Markup Language (HTML), Cascading Style Sheets (CSS), and Extensible HyperText Markup Language (XHTML). Designed to bring students up to the necessary skill and knowledge level for an intermediate Web programming course. (CSU)

CSCI 0062 - Web Programming I

http://catalog.sierracollege.edu/course-outlines/csci-0062/

Catalog Description DESCRIPTION IS HERE: Prerequisite: Completion of CSCI 10 with grade of "C" or better Hours: 72 (54 lecture, 18 laboratory) Description: Introduction to methods and techniques of Web programming. Includes coverage of HyperText Markup Language (HTML), Cascading Style Sheets (CSS), and Extensible HyperText Markup Language (XHTML). Designed to bring students up to the necessary skill and knowledge level for an intermediate Web programming course. (CSU) Units 3 Lecture-Discussion 54 Laboratory 18 By Arrangement Contact Hours 72 Outside of Class Hours Course Student Learning Outcomes Create navigation lists, create and use various types of links, and explain the difference between absolute and relative paths. Make an image map and link to various resources on the web, and work with hypertext attributes. Define style rules, demonstrate the use of style precedence and inheritance, and apply color using CSS. Use contextual selectors, work with attribute selectors, and apply text and font styles. Define list styles, use pseudo-classes, and create a rollover effect. Define and set a background image, use browser extension styles, and explain the difference between fixed, fluid, and elastic layouts. Set margins and padding, create rounded corners, use absolute and relative positioning, and work with overflow content, clipped objects and stacked objects. Create headings and cells in a table, use cells that span multiple rows/columns, define row/column groups, and add a table summary. Explain the difference between formatting a table using attributes vs. using CSS styles, collapse table borders, and create a multi-column layout. Create form elements and explain how web forms interact with web servers. Explore audio/video file formats and embed an audio/video clip using a variety of techniques. Explain how to incorporate Flash video (as well as YouTube video) and embed a Java applet using a variety of techniques. Course Content Outline I. Developing a Basic Web Page A. Introducing the World Wide Web B. HTML: The Language of the Web C. Creating an HTML Document D. Working with Block-Level Elements E. Creating Paragraphs F. Creating Lists G. Using Other Block-Level Elements H. Working with Inline Elements I. Understanding Logical and Physical Elements J. Working with Empty Elements K. Working with Special Characters II. Developing a Basic Web Site A. Working with Links B. Creating Element IDs C. Creating Links within a Document D. Creating Anchors E. Working with Web Site Structures F. Creating Links between Documents G. Linking to Resources on the Internet H. Working with Hypertext Attributes I. Using the Link Element III. Designing a Web Page A. Working with Color in HTML B. Defining Foreground and Background Colors C. Working with Fonts and Text Styles D. Choosing an Image Format E. Aligning an Image F. Setting Margins G. Setting the Image Size H. Inserting a Background Image I. Understanding Image Maps IV. Designing a Web Page with Tables A. Tables on the World Wide Web B. Creating a Text Table C. Defining a Table Structure D. Working with the Table Border E. Sizing a Table F. Spanning Rows and Columns G. Formatting Table Contents H. Working with Column Groups I. Using Tables for Layout J. Creating a Newspaper-Style Layout V. Designing a Web Site with Frames A. Introducing Frames B. Planning Your Frames C. Creating a Frameset D. Formatting a Frame E. Working with Frames and Links F. Using Reserved Target Names G. Using the noframes Element H. Working with Frame Borders I. Creating Inline Frames VI. Creating Web Page Forms A. Introducing Web Forms B. Creating the Form Element C. Creating Input Boxes D. Working with Form Labels E. Creating a Selection List F. Creating Option Buttons G. Creating a Field Set H. Creating Check Boxes I. Creating a Text Area Box J. Working with Form Buttons K. Working with Form Attributes L. Using the mailto Action M. Specifying the Tab Order N. Specifying an Access Key VII. Working with Cascading Style Sheets A. Introducing Cascading Style Sheets B. Using Inline Styles C. Using Embedded Styles D. Using an External Style Sheet E. Understanding Cascading Order F. Working with Selectors G. Using IDs and Classes H. Sizing Elements I. Floating an Element J. Working with the div Element K. Setting the Display Style L. Working with the Box Model M. Using Pseudo-Classes and Pseudo-Elements N. Applying a Style to a Web Site O. Positioning Objects with CSS P. Working with Overflow and Clipping Q. Stacking Elements R. Working with Different Media S. Hiding Elements T. Using Print Styles VIII. Using Multimedia on the Web A. Working with Multimedia B. Working with Audio C. Linking to an Audio Clip D. Embedding an Audio Clip E. Working with Video F. Linking to a Video Clip G. Embedding a Video Clip H. Using a Dynamic Source I. Supporting Non-Embedded Elements J. Introducing Java K. Working with Applets L. Creating a Marquee with Internet Explorer M. Working with the Object Element IX. Working with XHTML A. Introducing XHTML B. Creating a Well-Formed Document C. Creating a Valid Document D. Creating an XHTML Document E. Testing an XHTML Document F. Using Style Sheets and XHTML G. Tips for Converting old HTML code to XHTML Course Objectives Course Objectives Lecture Objectives: 1. Summarize the history of the Internet, the Web, and HTML. 2. Describe different HTML standards and specifications. 3. Explain the basic syntax of HTML code. 4. Compare and contrast block-level elements and inline elements. 5. Define an element's appearance with inline styles. 6. Compare and contrast logical and physical elements. 7. Define links and how to use them. 8. Describe how to set and use anchors for backward compatibility with older browsers. 9. List different types of Web site structures and how to employ them. 10. Compare and contrast absolute and relative paths. 11. Analyze the structure and contents of a URL. 12. Summarize how HTML handles color and how to use colors effectively. 13. Identify the different graphic formats supported on the Web and how to use them effectively. 14. Investigate how to use transparent images and animated graphics. 15. Explain image maps and how to use them. 16. Describe how to add summary information to a table. 17. Determine the width and height for different table elements. 18. Compare and contrast the different types of page layouts that you can achieve with tables. 19. List the uses of frames in a Web site. 20. Diagram a frame layout within a browser window. 21. Explain which reserved target names to specify as a target for a hypertext link. 22. Compare and contrast content for browsers that support frames and those that do not. 23. Describe how Web forms can interact with a server-based program. 24. Summarize the various parts of an online form. 25. Describe how data is sent from a Web form to a server. 26. Compare and contrast style precedence and style inheritance. 27. Explain how to float a block-level element. 28. Define a style for hypertext links in their four conditions. 29. Differentiate between pseudo-elements and pseudo-classes. 30. Identify document content with the DIV and SPAN tags and create styles for them. 31. Describe how to use cascading style sheets to design page layout. 32. Define external and embedded media. 33. List the different file formats for digital sound. 34. Define the different file formats for digital video. 35. Explain how to create a background sound with Internet Explorer. 36. Summarize the history and use of Java applets. 37. Summarize the history and theory of XHTML. 38. Describe the three XHTML DTDs and the differences between XHTML versions. 39. List the syntax rules for well-formed XHTML documents. 40. Explain how to apply a namespace. 41. Illustrate how to create a CDATA section for an embedded style sheet. Laboratory Objectives: 1. Construct elements using two-sided and one-sided tags. 2. Create and format different types of lists. 3. Create element IDs to mark specific locations within a document. 4. Create links to jump between sections of the same document. 5. Create links between documents. 6. Create foreground and background colors using styles. 7. Manipulate spacing between letters, words, and lines using styles. 8. Apply a background image to an element. 9. Create image map hotspots and link them to destination documents. 10. Create the basic structure of a graphical table. 11. Create table borders and gridlines. 12. Apply a background image and color to a table. 13. Create a newspaper-style layout using tables. 14. Modify the appearance of frames by setting the margin widths, removing scrollbars, and specifying whether users can resize frames. 15. Manipulate the color and size of frame borders. 16. Construct an inline frame within a Web page. 17. Create and format an input box for simple text data. 18. Construct a selection list for a predefined list of possible field values. 19. Design option buttons for a list of possible field values. 20. Generate form buttons to submit or reset a form. 21. Create inline, embedded, and external styles. 22. Create a background sound. 23. Modify applet parameters and insert a Java applet into a Web page. 24. Create a structured XHTML document and apply a DTD to it. Methods of Evaluation Essay Examinations Objective Examinations Projects Reports Reading Assignments 1. Read the assigned pages from the textbook and be prepared to discuss the use of HTML Tables in the context of page layout and be prepared to discuss in class. 2. Read the assigned pages from the textbook and be prepared to discuss in class the use of CSS to create dynamic web pages. Writing, Problem Solving or Performance 1. Complete all of the Case Studies at the end of the chapter and test the hypertext links on the web server to make sure that they work correctly. 2. Complete all of the Case Studies at the end of the chapter and test their web pages with a variety of external style sheets. Other (Term projects, research papers, portfolios, etc.) Methods of Instruction Laboratory Lecture/Discussion Distance Learning Other materials and-or supplies required of students that contribute to the cost of the course.